export default {
    data() {
        return {
            id: 0,
            ruleForm: {
                postData: {},
                band: [],
                radio: "1",
                sort: ''
            },
            rules: {
                name: [
                    {required: true, message: '请输入图片名称', trigger: 'blur'},
                ],
                band: [
                    {required: true, message: '请选择品牌', trigger: 'blur'},
                ],
            },
            imgList: [],			//图片列表
            postData: {},			//七牛云postData
            descImageUrl: '',		//图片
            desc_img: false,	    //是否展示删除
            domain: '',				//图片域名
            brandList: []
        }
    },

    //进入页面加载
    mounted: function () {
        var that = this;
        //在缓存中获取值
        that.user_name = sessionStorage.getItem("user_name");
        that.user_id = sessionStorage.getItem("user_id");
        that.token = sessionStorage.getItem("access-token");
        if ((!that.token) || (!that.user_id) || (!that.user_name)) {
            that.$router.push('/login');
        }

        //加载轮播详情
        if (that.$route.query.id) {
            that.id = that.$route.query.id;
            that.detail();
        }

        //获取七牛云token
        // that.getQiNiuToken();
        // that.allBrand();
    },

    //方法
    methods: {
        //请求api
        submitForm(formName) {
            var that = this;

            that.$router.push({path: '/works/video_info'});
            // this.$refs[formName].validate((valid) => {
            //     if (valid) {
            //         if (that.brand_id === 0) {
            //             that.addCitySwiper();
            //         } else {
            //             that.editCitySwiper();
            //         }
            //     } else {
            //         console.log('error submit!!');
            //         return false;
            //     }
            // });
        },

        //获取七牛云token
        getQiNiuToken: function () {
            var that = this;
            //请求登陆接口
            that.$http.post(that.adminApi.api_url + "/api/Qiniu/getToken", {
                token: that.token,
            }, {
                emulateJSON: true
            }).then(
                function (res) {
                    // 处理成功的结果
                    that.postData = {
                        token: res.body.upToken,
                    }
                    that.domain = res.body.domain;
                },
                function () {
                    // 处理失败的结果
                    that.$message({
                        type: 'error',
                        message: `操作提示: ${ '处理异常' }`
                    });
                });
        },

        //上传图片
        //删除
        descRemove(file, fileList) {
            var that = this;
            that.imgList = fileList;
        },
        descPictureCardPreview(file) {
            this.descImageUrl = file.url;
            this.desc_img = true;
        },
        descError(res) { //显示错误
            console.log(res)
        },
        descAvatarSuccess(res, file) { //上传成功后在图片框显示图片
            var that = this;
            var imageUrl = {
                url: that.domain + res.key,
                uid: file['raw']['uid']
            };
            that.imgList.push(imageUrl);
        },
        //文件超出个数限制时的钩子
        descExceed(files, fileList) {
            this.$message.error('只能上传一张图片');
        },

        //添加
        addCitySwiper: function () {
            var that = this;

            if (that.imgList.length === 0) {
                that.$message({
                    type: 'error',
                    message: `操作提示: ${ '请上传图片' }`
                });
                return false;
            }
            //请求的数据
            var formData = {};
            formData.token = that.token;
            formData.user_id = that.user_id;
            formData.brand_id = that.ruleForm.band;
            formData.picture = that.imgList[0]['url'];
            formData.status = that.ruleForm.radio;
            formData.sort = that.ruleForm.sort;

            //请求api
            that.$http.post(that.adminApi.api_url + "/api/brands/add", formData, {
                emulateJSON: true
            }).then(
                function (res) {
                    // 处理成功的结果
                    that.$message({
                        type: 'success',
                        message: `操作提示: ${ '添加成功' }`
                    });
                    that.$router.push({path: '/swiper/brand_list'});
                },
                function () {
                    // 处理失败的结果
                    that.$message({
                        type: 'error',
                        message: `操作提示: ${ '处理异常' }`
                    });
                });
        },

        //轮播详情
        detail: function () {
            var that = this;
            //请求的数据
            var formData = {};
            formData.token = that.token;
            formData.id = that.brand_id;

            //请求邀请者列表
            that.$http.post(that.adminApi.api_url + "/api/brands/show_edit", formData, {
                emulateJSON: true
            }).then(
                function (res) {
                    that.ruleForm.band = res.body.brand_id;
                    that.ruleForm.radio = res.body.status.toString();
                    that.ruleForm.sort = res.body.sort
                    that.imgList.push({
                        url: res.body.picture,
                    })
                },
                function () {
                    // 处理失败的结果
                    that.$message({
                        type: 'error',
                        message: `操作提示: ${ '处理异常' }`
                    });
                });
        },

        //修改
        editCitySwiper: function () {
            var that = this;
            if (that.imgList.length === 0) {
                that.$message({
                    type: 'error',
                    message: `操作提示: ${ '请上传图片' }`
                });
                return false;
            }

            //请求的数据
            var formData = {};
            formData.token = that.token;
            formData.id = that.brand_id;
            formData.user_id = that.user_id;
            formData.brand_id = that.ruleForm.band;
            formData.picture = that.imgList[0]['url'];
            formData.sort = that.ruleForm.sort;
            formData.status = that.ruleForm.radio;

            //请求API
            that.$http.post(that.adminApi.api_url + "/api/brands/edit", formData, {
                emulateJSON: true
            }).then(
                function (res) {
                    // 处理成功的结果
                    that.$message({
                        type: 'success',
                        message: `操作提示: ${ '修改成功' }`
                    });
                    that.$router.push({path: '/swiper/brand_list'});
                },
                function () {
                    // 处理失败的结果
                    that.$message({
                        type: 'error',
                        message: `操作提示: ${ '处理异常' }`
                    });
                });
        },

        //返回
        cancel: function () {
            var that = this;
            that.$router.push({path: '/works/score'});
        },

        //加载所有品牌
        allBrand: function () {
            var that = this;
            //请求的数据
            var formData = {};
            formData.token = that.token;

            //请求邀请者列表
            that.$http.post(that.adminApi.api_url + "/api/brands/brandlist", formData, {
                emulateJSON: true
            }).then(
                function (res) {
                    for (var i in res.body) {
                        that.brandList.push({
                            'value': res.body[i].id,
                            'label': res.body[i].english_name
                        })
                    }
                },
                function () {
                    // 处理失败的结果
                    that.$message({
                        type: 'error',
                        message: `操作提示: ${ '处理异常' }`
                    });
                });
        },
    }
}